<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:c ="http://java.sun.com/jsp/jstl/core">
    <body>
        <ui:composition template="./../plantillas/plantillaBase_1.xhtml">
            <ui:define name="titulo">
                Principal
            </ui:define>
            <ui:define name="scriptMapa">
                <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
                <script type="text/javascript" src="../resources/js/validaciones/validacion.js"></script>
            </ui:define>
            <ui:define name="login">
                <form id="form_login" action="${request.getContextPath()}/j_spring_security_check" method="post">
                    <h:form id="loginForm">
                        <c:if test="${not empty param.error}">
                            <c:set var="excepcion" value="${sessionScope.SPRING_SECURITY_LAST_EXCEPTION}"/>
                            <p:dialog modal="true" draggable="false" resizable="false" visible="true" showEffect="clip" widgetVar="dialogError" header="ERROR DE AUTENTICACI&Oacute;N" height="150" width="300" >
                                <center>
                                    <h:outputLabel value="${excepcion.getMessage()}" style="font-weight: bold"/>
                                </center>
                            </p:dialog>
                        </c:if>
                        <h:panelGrid columns="6" cellspacing="9">
                            <h:outputLabel for="j_username" value="Usuario:" style="color: white; font-weight: bold"/>
                            <h:inputText id="j_username" size="15"  />
                            <h:outputLabel for="j_password" value="Contrase&ntilde;a:" style="color: white; font-weight: bold"/>
                            <h:inputSecret id="j_password" size="15" />
                            <p:commandButton value="Aceptar" ajax="submit" update="messages" />
                        </h:panelGrid>
                    </h:form>
                </form>
            </ui:define>
            <ui:define name="googlemap">
                <h:form>
                    <p:fieldset legend="Bienvenido">
                        <h:panelGrid columns="1" >
                            <h:outputText value="En el siguiente mapa usted podrá observar las edificaciones culturales que se encuentran registradas en la Coordinación de Inspección y Licencias de Obra de la Secretaría de Cultura, mostrándolas de acuerdo al departamento/municipio seleccionando. En la parte inferior de la página encontramos dos iconos, el primero permite la creación de solicitud de inspección y el segundo la consulta del estado de expediente." />
                        </h:panelGrid>
                    </p:fieldset>
                    <br/>
                    <p:gmap center="13.796923136034692, -88.91942685546876" zoom="9" type="HYBRID" style="width: 900px; height: 500px"
                            model="#{managerPaginaPrincipal.emptyModel}" overlaySelectListener="#{managerPaginaPrincipal.onMarkerSelect}"
                            onOverlaySelectComplete="dlg.show();" onOverlaySelectUpdate="infoWindowBalloon">
                    </p:gmap>
                    <p:dialog id="infoWindowBalloon" header="Informacion inmueble" widgetVar="dlg" modal="true" draggable="false" resizable="false" showEffect="FADE_IN" hideEffect="FADE_OUT">
                        <h:panelGrid>
                            <p:graphicImage value="http://www.howdoiselfbuild.com/blog/wp-content/uploads/2009/09/3387-turf-houses.jpg" height="100%" width="100%"/>
                            <h:panelGroup>
                                <h:panelGrid columns="2" width="100%">
                                    <h:outputLabel value="Direccion: "/>
                                    <h:outputText value="#{managerPaginaPrincipal.direccionInmueble}"/>
                                    <h:outputLabel value="Municipio: "/>
                                    <h:outputText value="#{managerPaginaPrincipal.nombreMunicipio}"/>
                                    <h:outputLabel value="Departamento: "/>
                                    <h:outputText value="#{managerPaginaPrincipal.nombreDepartamento}"/>
                                </h:panelGrid>
                            </h:panelGroup>
                        </h:panelGrid>
                    </p:dialog>
                    <br/>
                </h:form>
            </ui:define>
            <ui:define name="contenido">
                <h:form id="seleccionLugar" prependId="false">
                    <p:fieldset legend="Mostrar inmuebles culturales por:">
                        <h:panelGrid columns="4" cellspacing="10">
                            <h:outputLabel value="Departamento:" />
                            <h:selectOneMenu id="departamentos" value="#{managerPaginaPrincipal.departamentoSeleccionado}">
                                <f:ajax event="change" execute="@this municipios" render="@all" listener="#{managerPaginaPrincipal.agregarChinches}"/>
                                <f:selectItems value="#{managerPaginaPrincipal.listaDeptos}"/>
                            </h:selectOneMenu>
                            <h:outputLabel value="Municipio:"/>
                            <h:selectOneMenu id="municipios" value="#{managerPaginaPrincipal.municipioSeleccionado}" >
                                <f:ajax event="change" execute="@this departamentos" render="@all" listener="#{managerPaginaPrincipal.agregarChinches}"/>
                                <f:selectItems value="#{managerPaginaPrincipal.listaMunicipiosFiltrados}"/>
                            </h:selectOneMenu>
                        </h:panelGrid>
                        <h:outputText value="En el mapa podrá observar una serie de casitas que muestran los expedientes que se encuentran ubicados en el departamento o municipio seleccionado."/>
                    </p:fieldset>
                    <br/>
                    <p:fieldset legend="Creaci&oacute;n de solicitud y consulta de expedientes">
                        <h:panelGrid columns="2" cellspacing="8" width="50%">
                            <h:panelGroup>
                                <h:graphicImage alt="Crear solicitud" url="../resources/icons/documents-64.png" width="25%" height="25%"/><br/>
                                <h:outputLink value="#{request.contextPath}/solicitud/crearSolicitud.jsf" style="font-weight: bold; color: orange;">CREAR SOLICITUD</h:outputLink>
                                <br/>
                            </h:panelGroup>
                            <h:panelGroup>
                                <h:graphicImage alt="Consultar estado de expediente" url="../resources/icons/checkout-64.png" width="25%" height="25%"/><br/>
                                <p:commandLink onclick="dlg1.show();" style="font-weight: bold; color: orange;" >CONSULTAR ESTADO</p:commandLink>
                            </h:panelGroup>
                        </h:panelGrid>
                    </p:fieldset>
                    <p:dialog modal="true" widgetVar="dlg1" header="Consultar Estado de Expediente." height="200" width="350" onCloseUpdate="num expe" closable="false" draggable="false" resizable="false">
                        <h:panelGrid width="300" cellspacing="15">
                            <h:panelGroup>
                                <h:outputLabel value="Número de Expediente: "/>
                                <p:inputMask id="num" mask="aa-99999-9999" size="13" value="#{managerConsultarEstado.numeroExpedienteConsulta}" onblur="upperCase(this.id)" />
                            </h:panelGroup>
                            <h:panelGroup>
                                <h:outputLabel value="Estado de expediente: "/>
                                <h:outputText id="expe" style="color: red; font-size: 18px" value="#{managerConsultarEstado.estado}"/>
                            </h:panelGroup>
                            <h:panelGroup>
                                <p:commandButton value="Buscar" image="ui-icon ui-icon-search" actionListener="#{managerConsultarEstado.buscandoInfo}" update="expe num msj"/>
                                <p:commandButton image="ui-icon ui-icon-circle-close" value="Cerrar" onclick="dlg1.close();" action="#{managerConsultarEstado.limpiar}" update="dlg1 expe num" process="@this" />
                            </h:panelGroup>
                        </h:panelGrid>
                    </p:dialog>
                    <p:growl id="msj" showDetail="true"/>
                </h:form>
            </ui:define>
        </ui:composition>
    </body>
</html>
